<!DOCTYPE html>
<html>
<head>
    <title>快递查询</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    <meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.
">


    <link rel="stylesheet" href="lib/weui.min.css">
    <link rel="stylesheet" href="css/jquery-weui.css">
    <link rel="stylesheet" href="css/style.css">

</head>

<body ontouchstart>

<header class="wy-header">
    <a class="wy-header-icon-back" href="index.html"><span></span></a>
    <div class="wy-header-title">快递查询</div>
</header>

<div class="weui-cells weui-cells_form">
    <div class="weui-cell weui-cell_select weui-cell_select-after">
        <div class="weui-cell__hd">
            <label for="" class="weui-label">查询类型</label>
        </div>
        <div class="weui-cell__bd">
            <select class="weui-select" name="select2">
                <option value="1">国内包裹查询</option>
                <option value="2">国外包裹查询</option>
            </select>
        </div>
    </div>

    <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">快递单号</label></div>
        <div class="weui-cell__bd">
            <input class="weui-input" type="number" pattern="[0-9]*" placeholder="请输入快递单号">
        </div>
    </div>

</div>


<div class="weui-btn-area">
    <a class="weui-btn weui-btn_primary" href="javascript:" id="showTooltips">查询</a>
</div>
<div class="result weui-cells">
    <section class="van-doc-demo-block">
        <h2 class="van-doc-demo-block__title">快递状态</h2>
        <div class="van-steps van-steps--vertical">
            <div class="van-steps__items">
                <div class="van-hairline van-step van-step--vertical van-step--process">
                    <div class="van-step__title" style="color: rgb(7, 193, 96);"><h3>【城市】物流状态1</h3>
                        <p>2016-07-12 12:40</p></div>
                    <div class="van-step__circle-container"><i class="weui-icon-success" style="color: #09bb07;font-size: 12px;"></i></div>
                    <div class="van-step__line"></div>
                </div>
                <div class="van-hairline van-step van-step--vertical">
                    <div class="van-step__title"><h3>【城市】物流状态</h3>
                        <p>2016-07-11 10:00</p></div>
                    <div class="van-step__circle-container"><i class="van-step__circle"></i></div>
                    <div class="van-step__line"></div>
                </div>
                <div class="van-hairline van-step van-step--vertical">
                    <div class="van-step__title"><h3>快件已发货</h3>
                        <p>2016-07-10 09:30</p></div>
                    <div class="van-step__circle-container"><i class="van-step__circle"></i></div>
                    <div class="van-step__line"></div>
                </div>
            </div>
        </div>
    </section>
</div>

<!--底部导航-->
<div class="foot-black"></div>
<div class="weui-tabbar wy-foot-menu">
    <a href="index.html" class="weui-tabbar__item weui-bar__item--on">
        <div class="weui-tabbar__icon foot-menu-home"></div>
        <p class="weui-tabbar__label">首页</p>
    </a>
    <a href="yunfei.html" class="weui-tabbar__item">
        <div class="weui-tabbar__icon foot-menu-list"></div>
        <p class="weui-tabbar__label">运费估算</p>
    </a>
    <a href="zhuizong.html" class="weui-tabbar__item weui-bar__item--on">
        <div class="weui-tabbar__icon foot-menu-cart"></div>
        <p class="weui-tabbar__label">快递追踪</p>
    </a>
    <a href="mine.html" class="weui-tabbar__item">
        <div class="weui-tabbar__icon foot-menu-member"></div>
        <p class="weui-tabbar__label">我的</p>
    </a>
</div>

<script src="../lib/jquery-2.1.4.js"></script>
<script src="../lib/fastclick.js"></script>
<script>
    $(function () {
        FastClick.attach(document.body);
    });
</script>
<script src="../js/jquery-weui.js"></script>


<script>
    $("#showTooltips").click(function () {
        var tel = $('#tel').val();
        var code = $('#code').val();
        if (!tel || !/1[3|4|5|7|8]\d{9}/.test(tel)) $.toptip('请输入手机号');
        else if (!code || !/\d{6}/.test(code)) $.toptip('请输入六位手机验证码');
        else $.toptip('提交成功', 'success');
    });
</script>
</body>
</html>
